import createG2 from 'g2-react';
import G2 from 'g2';
import React from 'react';
import {Slider} from "antd";
const Chart = createG2(chart => {
  chart.col('trend', {
    type: 'cat',
    alias: '趋势',
    values: ['上涨','下跌']
  });
  chart.col('time', {
    type: 'timeCat',
    nice: false,
    mask: 'mm-dd',
    alias: '时间',
    tickCount: 10
  });
  chart.col('volumn', {alias: '成交量'});
  chart.col('start', {alias: '开盘价'});
  chart.col('end', {alias: '收盘价'});
  chart.col('max', {alias: '最高价'});
  chart.col('min', {alias: '最低价'});
  chart.col('start+end+max+min', {alias: '股票价格'});
  chart.axis('time', {
    title: null
  });
  chart.schema()
    .position('time*(start+end+max+min)')
    .color('trend', ['#2AF483','#F80041'])
    .shape('candle')
    .tooltip('start*end*max*min*volumn');
  const frame = chart.get('data');
  const chart1 = new G2.Chart({
    id: 'c1',
    forceFit: true,
    height: 60,
    plotCfg: {
      margin: [5, 120, 10],
      background: {
        fill: '#191821'
      }
    }
  });
  chart1.source(frame);
  chart1.col('volumn', {
    alias: '成交量(万)',
    tickCount: 2,
  });
  chart1.col('time',{
    type: 'timeCat',
    nice: false,
    mask: 'mm-dd',
    alias: '时间',
    tickCount: 10
  });
  chart1.axis('time', false);
  chart1.axis('volumn', {
    title: {
      textAlign: 'center'
    },
    formatter: function(val) {
      return parseInt(val / 1000, 10) + 'k';
    }
  });
  chart1.interval()
    .position('time*volumn')
    .color('trend', ['#2AF483','#F80041'])
    .tooltip('volumn');
/*
  chart1.legend('trend', false);*/
  /*const slider = new Slider({
    domId: 'slider',
    height: 30,
    charts: [chart, chart1],
    xDim: 'time',
    yDim: 'max'
  });
  slider.render();*/
});
export default class MyComponent extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      data: [{"time":"2015-11-19","start":8.18,"max":8.33,"min":7.98,"end":8.32,"volumn":1810,"money":14723.56},
        {"time":"2015-11-18","start":8.37,"max":8.6,"min":8.03,"end":8.09,"volumn":2790.37,"money":23309.19},
        {"time":"2015-11-17","start":8.7,"max":8.78,"min":8.32,"end":8.37,"volumn":3729.04,"money":31709.71},
        {"time":"2015-11-16","start":8.18,"max":8.69,"min":8.05,"end":8.62,"volumn":3095.44,"money":26100.69},
        {"time":"2015-11-13","start":8.01,"max":8.75,"min":7.97,"end":8.41,"volumn":5815.58,"money":48562.37},
        {"time":"2015-11-12","start":7.76,"max":8.18,"min":7.61,"end":8.15,"volumn":4742.6,"money":37565.36},
        {"time":"2015-11-11","start":7.55,"max":7.81,"min":7.49,"end":7.8,"volumn":3133.82,"money":24065.42},
        {"time":"2015-11-10","start":7.5,"max":7.68,"min":7.44,"end":7.57,"volumn":2670.35,"money":20210.58},
        {"time":"2015-11-09","start":7.65,"max":7.66,"min":7.3,"end":7.58,"volumn":2841.79,"money":21344.36},
        {"time":"2015-11-06","start":7.52,"max":7.71,"min":7.48,"end":7.64,"volumn":2725.44,"money":20721.51},
        {"time":"2015-11-05","start":7.48,"max":7.57,"min":7.29,"end":7.48,"volumn":3520.85,"money":26140.83},
        {"time":"2015-11-04","start":7.01,"max":7.5,"min":7.01,"end":7.46,"volumn":3591.47,"money":26285.52},
        {"time":"2015-11-03","start":7.1,"max":7.17,"min":6.82,"end":7,"volumn":2029.21,"money":14202.33},
        {"time":"2015-11-02","start":7.09,"max":7.44,"min":6.93,"end":7.17,"volumn":3191.31,"money":23205.11},
        {"time":"2015-10-30","start":6.98,"max":7.27,"min":6.84,"end":7.18,"volumn":3522.61,"money":25083.44},
        {"time":"2015-10-29","start":6.94,"max":7.2,"min":6.8,"end":7.05,"volumn":2752.27,"money":19328.44},
        {"time":"2015-10-28","start":7.01,"max":7.14,"min":6.8,"end":6.85,"volumn":2311.11,"money":16137.32},
        {"time":"2015-10-27","start":6.91,"max":7.31,"min":6.48,"end":7.18,"volumn":3172.9,"money":21827.3},
        {"time":"2015-10-26","start":6.9,"max":7.08,"min":6.87,"end":6.95,"volumn":2769.31,"money":19337.44},
        {"time":"2015-10-23","start":6.71,"max":6.85,"min":6.58,"end":6.79,"volumn":2483.18,"money":16714.31},
        {"time":"2015-10-22","start":6.38,"max":6.67,"min":6.34,"end":6.65,"volumn":2225.88,"money":14465.56},
        {"time":"2015-10-21","start":7.08,"max":7.1,"min":6.41,"end":6.41,"volumn":2891.47,"money":19585.98},
        {"time":"2015-10-20","start":6.88,"max":7.19,"min":6.85,"end":7.12,"volumn":2389.62,"money":16813.58},
        {"time":"2015-10-19","start":7.1,"max":7.14,"min":6.8,"end":6.94,"volumn":2786.61,"money":19474.72},
        {"time":"2015-10-16","start":6.92,"max":7.38,"min":6.73,"end":7.15,"volumn":3289.27,"money":22963.97},
        {"time":"2015-10-15","start":6.63,"max":6.9,"min":6.6,"end":6.89,"volumn":2440.37,"money":16575.84},
        {"time":"2015-10-14","start":6.7,"max":6.99,"min":6.61,"end":6.66,"volumn":2496.38,"money":16858.28},
        {"time":"2015-10-13","start":6.55,"max":6.81,"min":6.55,"end":6.75,"volumn":2299.83,"money":15338.24},
        {"time":"2015-10-12","start":6.29,"max":6.89,"min":6.29,"end":6.69,"volumn":3147.58,"money":20738.35},
        {"time":"2015-10-09","start":6.1,"max":6.44,"min":6.08,"end":6.34,"volumn":2664.04,"money":16811.14},
        {"time":"2015-10-08","start":6.11,"max":6.28,"min":6,"end":6.12,"volumn":2197.23,"money":13440.92},
        {"time":"2015-09-30","start":5.93,"max":6.12,"min":5.81,"end":5.83,"volumn":1459.64,"money":8659.52},
        {"time":"2015-09-29","start":5.96,"max":5.98,"min":5.73,"end":5.83,"volumn":1047.42,"money":6132.72},
        {"time":"2015-09-28","start":5.86,"max":6.13,"min":5.85,"end":6.07,"volumn":952.45,"money":5717.33},
        {"time":"2015-09-25","start":6.23,"max":6.28,"min":5.85,"end":5.96,"volumn":1395.27,"money":8465.95},
        {"time":"2015-09-24","start":6.16,"max":6.32,"min":6.1,"end":6.27,"volumn":1434.38,"money":8920.88},
        {"time":"2015-09-23","start":6.18,"max":6.32,"min":6.02,"end":6.12,"volumn":1558.54,"money":9631.38},
        {"time":"2015-09-22","start":6.35,"max":6.4,"min":6.15,"end":6.25,"volumn":1893.83,"money":11901.51},
        {"time":"2015-09-21","start":5.83,"max":6.32,"min":5.83,"end":6.31,"volumn":1748.35,"money":10807.66},
        {"time":"2015-09-18","start":6,"max":6.1,"min":5.81,"end":6.02,"volumn":1507.09,"money":8999.44},
        {"time":"2015-09-17","start":6.1,"max":6.34,"min":5.8,"end":5.83,"volumn":2135.64,"money":13039.56},
        {"time":"2015-09-16","start":5.58,"max":6.07,"min":5.4,"end":6.07,"volumn":1758.57,"money":10132.25},
        {"time":"2015-09-15","start":5.81,"max":6.09,"min":5.52,"end":5.52,"volumn":1617.12,"money":9248.69},
        {"time":"2015-09-14","start":6.98,"max":7.06,"min":6.13,"end":6.13,"volumn":1982.9,"money":12989.01},
        {"time":"2015-09-11","start":6.87,"max":7.01,"min":6.68,"end":6.81,"volumn":1371.77,"money":9370.49},
        {"time":"2015-09-10","start":6.7,"max":7.17,"min":6.65,"end":6.86,"volumn":2181.33,"money":15169.4},
        {"time":"2015-09-09","start":6.76,"max":7.03,"min":6.65,"end":6.93,"volumn":2105.28,"money":14426.76},
        {"time":"2015-09-08","start":6.26,"max":6.7,"min":6.01,"end":6.64,"volumn":1506.53,"money":9556.54},
        {"time":"2015-09-07","start":6.19,"max":6.45,"min":6.09,"end":6.2,"volumn":1605.85,"money":10091.26},
        {"time":"2015-09-02","start":6.2,"max":6.84,"min":5.98,"end":5.99,"volumn":1934.95,"money":12225.68},
        {"time":"2015-09-01","start":7.22,"max":7.28,"min":6.64,"end":6.64,"volumn":2645.87,"money":18017.91},
        {"time":"2015-08-31","start":7.83,"max":8,"min":7.35,"end":7.38,"volumn":2984.03,"money":23031.24},
        {"time":"2015-08-28","start":7.3,"max":7.77,"min":7.1,"end":7.77,"volumn":3092.6,"money":23121.49},
        {"time":"2015-08-27","start":6.75,"max":7.1,"min":6.43,"end":7.06,"volumn":2903.76,"money":19848.87},
        {"time":"2015-08-26","start":7.13,"max":7.43,"min":6.42,"end":6.58,"volumn":4212.04,"money":29069.25},
        {"time":"2015-08-25","start":7.13,"max":7.29,"min":7.13,"end":7.13,"volumn":1838.59,"money":13140.8},
        {"time":"2015-08-24","start":8.4,"max":8.4,"min":7.92,"end":7.92,"volumn":1766.39,"money":14168.86},
        {"time":"2015-08-21","start":9,"max":9.61,"min":8.53,"end":8.8,"volumn":3388.27,"money":30952.11},
        {"time":"2015-08-20","start":10.02,"max":10.24,"min":9.32,"end":9.33,"volumn":3902.17,"money":38391.68},
        {"time":"2015-08-19","start":9.3,"max":10.59,"min":9.01,"end":10.35,"volumn":5568.96,"money":53928.79},
        {"time":"2015-08-18","start":11.18,"max":11.5,"min":10,"end":10,"volumn":7332.7,"money":78439.61},
        {"time":"2015-08-17","start":10.2,"max":11.11,"min":9.9,"end":11.11,"volumn":8121.86,"money":86298.92},
        {"time":"2015-08-14","start":9.58,"max":10.37,"min":9.37,"end":10.1,"volumn":6001.61,"money":58425.11},
        {"time":"2015-08-13","start":9.14,"max":9.5,"min":8.91,"end":9.49,"volumn":3854.19,"money":35696.27},
        {"time":"2015-08-12","start":9.09,"max":9.68,"min":8.98,"end":9.29,"volumn":4238.57,"money":39909.3},
        {"time":"2015-08-11","start":9.23,"max":9.47,"min":9,"end":9.15,"volumn":4294.85,"money":39674.71},
        {"time":"2015-08-10","start":8.9,"max":9.38,"min":8.76,"end":9.2,"volumn":4013.11,"money":36287.89},
        {"time":"2015-08-07","start":8.36,"max":8.8,"min":8.31,"end":8.7,"volumn":3092.66,"money":26336.76},
        {"time":"2015-08-06","start":8.03,"max":8.42,"min":7.95,"end":8.25,"volumn":2072.21,"money":17060.11},
        {"time":"2015-08-05","start":8.5,"max":8.69,"min":8.08,"end":8.28,"volumn":3533.94,"money":29796.96},
        {"time":"2015-08-04","start":7.65,"max":8.39,"min":7.65,"end":8.39,"volumn":3067.22,"money":24773.88},
        {"time":"2015-08-03","start":8.15,"max":8.4,"min":7.6,"end":7.63,"volumn":3098.33,"money":24382.99},
        {"time":"2015-07-31","start":8.7,"max":9.01,"min":8.25,"end":8.44,"volumn":3500.61,"money":30289.83},
        {"time":"2015-07-30","start":8.92,"max":9.65,"min":8.7,"end":8.97,"volumn":6022.8,"money":55624.85},
        {"time":"2015-07-29","start":8.35,"max":8.91,"min":7.78,"end":8.88,"volumn":4177.18,"money":34893.2},
        {"time":"2015-07-28","start":8,"max":9,"min":7.92,"end":8.1,"volumn":5114.55,"money":42095.99},
        {"time":"2015-07-27","start":9.4,"max":9.99,"min":8.8,"end":8.8,"volumn":6001.51,"money":56962.25},
        {"time":"2015-07-24","start":9.27,"max":10.28,"min":9.11,"end":9.78,"volumn":8446.76,"money":81991.19},
        {"time":"2015-07-23","start":9,"max":9.78,"min":8.74,"end":9.46,"volumn":8496.1,"money":77551.01},
        {"time":"2015-07-22","start":8.08,"max":8.97,"min":8.05,"end":8.97,"volumn":8676.75,"money":75751.1},
        {"time":"2015-07-21","start":7.8,"max":8.33,"min":7.65,"end":8.15,"volumn":4631.15,"money":37450.78},
        {"time":"2015-07-20","start":7.72,"max":8.27,"min":7.63,"end":8.05,"volumn":6428.2,"money":51127.98},
        {"time":"2015-07-17","start":6.94,"max":7.73,"min":6.94,"end":7.73,"volumn":4835.44,"money":36666.58},
        {"time":"2015-07-16","start":6.53,"max":7.48,"min":6.42,"end":7.03,"volumn":3605.77,"money":25031.15},
        {"time":"2015-07-15","start":7.57,"max":7.83,"min":7.13,"end":7.13,"volumn":2729.59,"money":20041.75},
        {"time":"2015-07-14","start":8.2,"max":8.7,"min":7.66,"end":7.92,"volumn":7073.81,"money":58131.16},
        {"time":"2015-07-13","start":7.5,"max":8.1,"min":7.5,"end":8.1,"volumn":4573.92,"money":36083.69},
        {"time":"2015-07-10","start":6.9,"max":7.36,"min":6.88,"end":7.36,"volumn":4183.37,"money":30411.19},
        {"time":"2015-07-09","start":5.47,"max":6.69,"min":5.47,"end":6.69,"volumn":6661.78,"money":40398.96},
        {"time":"2015-07-08","start":6.08,"max":6.08,"min":6.08,"end":6.08,"volumn":158.16,"money":961.61},
        {"time":"2015-07-07","start":6.77,"max":6.88,"min":6.75,"end":6.75,"volumn":383.45,"money":2590.85},
        {"time":"2015-07-06","start":9.1,"max":9.1,"min":7.5,"end":7.5,"volumn":2968.98,"money":24002.6},
        {"time":"2015-07-03","start":8.38,"max":8.87,"min":8.33,"end":8.33,"volumn":2641.73,"money":22223.44},
        {"time":"2015-07-02","start":10.38,"max":10.38,"min":9.26,"end":9.26,"volumn":2611.06,"money":24620.81},
        {"time":"2015-07-01","start":11.31,"max":11.61,"min":10.29,"end":10.29,"volumn":3401.45,"money":37212.87},
        {"time":"2015-06-30","start":10.08,"max":11.52,"min":10.01,"end":11.43,"volumn":4205.99,"money":45381.06},
        {"time":"2015-06-29","start":12.96,"max":12.96,"min":11.12,"end":11.12,"volumn":3745.68,"money":44252.47},
        {"time":"2015-06-26","start":13.15,"max":13.41,"min":12.36,"end":12.36,"volumn":3675.91,"money":46759.29},
        {"time":"2015-06-25","start":13.71,"max":14.46,"min":13.3,"end":13.73,"volumn":4907.6,"money":68290.5},
        {"time":"2015-06-24","start":13.35,"max":13.85,"min":12.9,"end":13.71,"volumn":3656.8,"money":49219.92},
        {"time":"2015-06-23","start":13.26,"max":13.64,"min":12.26,"end":13.2,"volumn":3566.35,"money":45904.78},
        {"time":"2015-06-19","start":14.45,"max":14.97,"min":13.62,"end":13.62,"volumn":3621.43,"money":51108.31},
        {"time":"2015-06-18","start":14.5,"max":16,"min":14.3,"end":15.13,"volumn":5046.59,"money":77208.53},
        {"time":"2015-06-17","start":14.46,"max":15,"min":14,"end":14.6,"volumn":3483.7,"money":50495.84},
        {"time":"2015-06-16","start":14,"max":15.1,"min":13.42,"end":14.8,"volumn":4844.74,"money":68953.77},
        {"time":"2015-06-15","start":14.5,"max":15.09,"min":14.1,"end":14.39,"volumn":4008.2,"money":58703.24},
        {"time":"2015-06-12","start":14.07,"max":14.97,"min":14,"end":14.37,"volumn":5399.47,"money":78592.45},
        {"time":"2015-06-11","start":13.4,"max":14.5,"min":13.19,"end":14.13,"volumn":5472.93,"money":76037.31},
        {"time":"2015-06-10","start":12.95,"max":13.47,"min":12.71,"end":13.37,"volumn":4087.74,"money":53951.64},
        {"time":"2015-06-09","start":13.46,"max":13.46,"min":12.85,"end":13.12,"volumn":4371.67,"money":57352.21},
        {"time":"2015-06-08","start":12.88,"max":13.69,"min":12.59,"end":13.61,"volumn":7406.58,"money":98236.3},
        {"time":"2015-06-05","start":12.38,"max":12.94,"min":12.24,"end":12.77,"volumn":5386.66,"money":68208.51},
        {"time":"2015-06-04","start":12.55,"max":12.81,"min":11.29,"end":12.31,"volumn":3905.22,"money":47415.64},
        {"time":"2015-06-03","start":13,"max":13.15,"min":12.2,"end":12.54,"volumn":4559.61,"money":57928.58},
        {"time":"2015-06-02","start":11.84,"max":12.77,"min":11.48,"end":12.73,"volumn":4405.17,"money":52747.92},
        {"time":"2015-06-01","start":11.29,"max":11.8,"min":11,"end":11.74,"volumn":3308.94,"money":38060.2},
        {"time":"2015-05-29","start":11.3,"max":11.65,"min":10.31,"end":11.11,"volumn":3434.12,"money":38143.88},
        {"time":"2015-05-28","start":12.79,"max":12.99,"min":11.39,"end":11.4,"volumn":4979.63,"money":61398.36},
        {"time":"2015-05-27","start":12.89,"max":13.18,"min":12.5,"end":12.66,"volumn":4886.86,"money":62349.63},
        {"time":"2015-05-26","start":12.4,"max":13.08,"min":11.96,"end":12.92,"volumn":5838.51,"money":73409.96},
        {"time":"2015-05-25","start":11.7,"max":12.87,"min":11.61,"end":12.3,"volumn":6405.2,"money":78937.32},
        {"time":"2015-05-22","start":11.39,"max":11.89,"min":11.18,"end":11.71,"volumn":5519.87,"money":63515.93},
        {"time":"2015-05-21","start":11.27,"max":11.35,"min":11.05,"end":11.33,"volumn":4132.8,"money":46318.65},
        {"time":"2015-05-20","start":11.23,"max":11.48,"min":10.81,"end":11.32,"volumn":6859.76,"money":76273.65},
        {"time":"2015-05-19","start":11.5,"max":11.78,"min":11,"end":11.33,"volumn":6864.05,"money":77731.34},
        {"time":"2015-05-18","start":11.68,"max":12.25,"min":11.45,"end":12.15,"volumn":4236.5,"money":50728.6},
        {"time":"2015-05-15","start":11.19,"max":12.28,"min":10.8,"end":11.69,"volumn":5515.66,"money":64496.32},
        {"time":"2015-05-14","start":10.18,"max":11.19,"min":10.11,"end":11.19,"volumn":4181.77,"money":45399.19},
        {"time":"2015-05-13","start":10.2,"max":10.32,"min":10,"end":10.17,"volumn":2247.39,"money":22781.23},
        {"time":"2015-05-12","start":10.3,"max":10.36,"min":10.01,"end":10.28,"volumn":2010.65,"money":20480.63},
        {"time":"2015-05-11","start":9.98,"max":10.36,"min":9.89,"end":10.3,"volumn":2101.26,"money":21367.53},
        {"time":"2015-05-08","start":9.82,"max":10.08,"min":9.65,"end":9.94,"volumn":1609.43,"money":15845.56},
        {"time":"2015-05-07","start":9.62,"max":9.84,"min":9.45,"end":9.6,"volumn":1270.86,"money":12241.17},
        {"time":"2015-05-06","start":10.18,"max":10.25,"min":9.6,"end":9.66,"volumn":1754.7,"money":17347.05},
        {"time":"2015-05-05","start":10.68,"max":10.68,"min":10,"end":10.02,"volumn":1903.5,"money":19598.64},
        {"time":"2015-05-04","start":10.61,"max":10.84,"min":10.55,"end":10.72,"volumn":1554.93,"money":16624.43},
        {"time":"2015-04-30","start":10.4,"max":11.05,"min":10.4,"end":10.63,"volumn":2169.06,"money":23333.06},
        {"time":"2015-04-29","start":10.31,"max":10.64,"min":10.25,"end":10.4,"volumn":1614.77,"money":16910.96},
        {"time":"2015-04-28","start":11.07,"max":11.25,"min":10.46,"end":10.49,"volumn":2552.21,"money":27515.88},
        {"time":"2015-04-27","start":10.6,"max":11.67,"min":10.6,"end":11.06,"volumn":4216.46,"money":47534.53},
        {"time":"2015-04-24","start":10.5,"max":10.85,"min":10.25,"end":10.61,"volumn":2326.42,"money":24599.63},
        {"time":"2015-04-23","start":10.26,"max":10.93,"min":10.11,"end":10.7,"volumn":3767.77,"money":39643.72},
        {"time":"2015-04-22","start":10.22,"max":10.42,"min":10.08,"end":10.23,"volumn":2868.77,"money":29316.49},
        {"time":"2015-04-21","start":9.56,"max":10.2,"min":9.4,"end":10.19,"volumn":3493.61,"money":34865.01},
        {"time":"2015-04-20","start":9.71,"max":9.99,"min":9.42,"end":9.6,"volumn":2462.09,"money":23769.5},
        {"time":"2015-04-17","start":9.79,"max":10.09,"min":9.16,"end":9.82,"volumn":4473.33,"money":43367.29},
        {"time":"2015-04-16","start":9.36,"max":10.04,"min":8.9,"end":9.66,"volumn":2851.79,"money":27210.03},
        {"time":"2015-04-15","start":10.03,"max":10.28,"min":9.37,"end":9.43,"volumn":3138.11,"money":30713.13},
        {"time":"2015-04-14","start":10.33,"max":10.33,"min":9.98,"end":10.03,"volumn":2951.59,"money":29803.4},
        {"time":"2015-04-13","start":10.3,"max":10.63,"min":10.2,"end":10.33,"volumn":3196.99,"money":33351.76},
        {"time":"2015-04-10","start":10.25,"max":10.5,"min":10,"end":10.28,"volumn":2565.64,"money":26337.81},
        {"time":"2015-04-09","start":9.78,"max":10.48,"min":9.58,"end":10.22,"volumn":4316.86,"money":43647.33},
        {"time":"2015-04-08","start":9.46,"max":9.86,"min":9.02,"end":9.78,"volumn":3683.43,"money":34664.66},
        {"time":"2015-04-07","start":9.53,"max":9.87,"min":9.38,"end":9.44,"volumn":3874.06,"money":37076.79},
        {"time":"2015-04-03","start":8.6,"max":9.48,"min":8.4,"end":9.48,"volumn":3760.78,"money":34361.28},
        {"time":"2015-04-02","start":8.45,"max":8.74,"min":8.18,"end":8.62,"volumn":3076.83,"money":26112.98},
        {"time":"2015-04-01","start":8.16,"max":8.61,"min":8.06,"end":8.45,"volumn":2396.89,"money":20000.88},
        {"time":"2015-03-31","start":8.18,"max":8.5,"min":8.13,"end":8.16,"volumn":1938,"money":15989.33},
        {"time":"2015-03-30","start":8.2,"max":8.53,"min":8.11,"end":8.26,"volumn":2820.79,"money":23532.99},
        {"time":"2015-03-27","start":8.4,"max":8.4,"min":8.01,"end":8.28,"volumn":4634.57,"money":38032.68},
        {"time":"2015-03-26","start":7.39,"max":8.12,"min":7.32,"end":8.12,"volumn":4209.29,"money":33643.03},
        {"time":"2015-03-25","start":7.36,"max":7.6,"min":7.2,"end":7.38,"volumn":1845.49,"money":13550.21},
        {"time":"2015-03-24","start":7.62,"max":7.62,"min":7.2,"end":7.35,"volumn":2264.5,"money":16699.5},
        {"time":"2015-03-23","start":7.54,"max":7.68,"min":7.46,"end":7.59,"volumn":1834.28,"money":13855.41},
        {"time":"2015-03-20","start":7.33,"max":7.65,"min":7.25,"end":7.55,"volumn":2470.71,"money":18588.13},
        {"time":"2015-03-19","start":7.38,"max":7.66,"min":7.26,"end":7.37,"volumn":2450.54,"money":18247.82},
        {"time":"2015-03-18","start":7.12,"max":7.46,"min":7.1,"end":7.37,"volumn":2854.4,"money":20828.88},
        {"time":"2015-03-17","start":6.95,"max":7.13,"min":6.87,"end":7.09,"volumn":2457.13,"money":17162.55},
        {"time":"2015-03-16","start":6.8,"max":7.06,"min":6.79,"end":6.95,"volumn":1858.78,"money":12924.21},
        {"time":"2015-03-13","start":6.85,"max":6.93,"min":6.69,"end":6.79,"volumn":1167.06,"money":7909.64},
        {"time":"2015-03-12","start":6.84,"max":7.06,"min":6.71,"end":6.85,"volumn":2152.85,"money":14835.41},
        {"time":"2015-03-11","start":6.98,"max":7.04,"min":6.77,"end":6.84,"volumn":1445.77,"money":9886.53},
        {"time":"2015-03-10","start":6.73,"max":6.99,"min":6.7,"end":6.97,"volumn":1999.93,"money":13770.37},
        {"time":"2015-03-09","start":6.59,"max":6.88,"min":6.4,"end":6.72,"volumn":2243.1,"money":14951.1},
        {"time":"2015-03-06","start":6.47,"max":6.6,"min":6.35,"end":6.5,"volumn":1270.49,"money":8229.96},
        {"time":"2015-03-05","start":6.43,"max":6.54,"min":6.34,"end":6.47,"volumn":1363.09,"money":8789.45},
        {"time":"2015-03-04","start":6.35,"max":6.45,"min":6.32,"end":6.41,"volumn":1295.42,"money":8265.63},
        {"time":"2015-03-03","start":6.16,"max":6.47,"min":6.07,"end":6.42,"volumn":2266.82,"money":14214.79},
        {"time":"2015-03-02","start":6.22,"max":6.25,"min":6.07,"end":6.17,"volumn":1277.88,"money":7850.34},
        {"time":"2015-02-27","start":6.16,"max":6.33,"min":6.15,"end":6.19,"volumn":908.98,"money":5663.74},
        {"time":"2015-02-26","start":6.12,"max":6.18,"min":6.1,"end":6.16,"volumn":703.72,"money":4328.56},
        {"time":"2015-02-25","start":6.09,"max":6.18,"min":6.03,"end":6.12,"volumn":766.56,"money":4678.73},
        {"time":"2015-02-17","start":6.11,"max":6.15,"min":6.06,"end":6.08,"volumn":766.73,"money":4677.31},
        {"time":"2015-02-16","start":6.03,"max":6.14,"min":6.01,"end":6.11,"volumn":814.71,"money":4948.33},
        {"time":"2015-02-13","start":5.98,"max":6.34,"min":5.93,"end":6.08,"volumn":1992.56,"money":12135.01},
        {"time":"2015-02-12","start":5.72,"max":6.1,"min":5.66,"end":6.01,"volumn":2572.38,"money":15312.73},
        {"time":"2015-02-11","start":5.69,"max":5.77,"min":5.67,"end":5.72,"volumn":602.66,"money":3443.99},
        {"time":"2015-02-10","start":5.46,"max":5.75,"min":5.43,"end":5.73,"volumn":1298.63,"money":7307.42},
        {"time":"2015-02-09","start":5.59,"max":5.59,"min":5.47,"end":5.48,"volumn":435.98,"money":2410.09},
        {"time":"2015-02-06","start":5.5,"max":5.62,"min":5.48,"end":5.61,"volumn":630.6,"money":3490.13},
        {"time":"2015-02-05","start":5.58,"max":5.59,"min":5.47,"end":5.48,"volumn":636.7,"money":3521.89},
        {"time":"2015-02-04","start":5.63,"max":5.67,"min":5.52,"end":5.52,"volumn":635.38,"money":3548.96},
        {"time":"2015-02-03","start":5.63,"max":5.67,"min":5.56,"end":5.65,"volumn":434.34,"money":2439.08},
        {"time":"2015-02-02","start":5.55,"max":5.65,"min":5.51,"end":5.61,"volumn":338.71,"money":1896.01},
        {"time":"2015-01-30","start":5.78,"max":5.85,"min":5.6,"end":5.65,"volumn":574.74,"money":3270.25},
        {"time":"2015-01-29","start":5.8,"max":5.87,"min":5.74,"end":5.78,"volumn":605.55,"money":3516.14},
        {"time":"2015-01-28","start":5.89,"max":5.95,"min":5.82,"end":5.85,"volumn":653.47,"money":3846.52},
        {"time":"2015-01-27","start":5.72,"max":5.94,"min":5.7,"end":5.89,"volumn":1398.84,"money":8194.18},
        {"time":"2015-01-26","start":5.65,"max":5.73,"min":5.58,"end":5.72,"volumn":930.19,"money":5247.01},
        {"time":"2015-01-23","start":5.68,"max":5.72,"min":5.6,"end":5.62,"volumn":758.13,"money":4284.8},
        {"time":"2015-01-22","start":5.49,"max":5.78,"min":5.41,"end":5.71,"volumn":1139.94,"money":6386.11},
        {"time":"2015-01-21","start":5.36,"max":5.58,"min":5.33,"end":5.55,"volumn":701.11,"money":3840.84},
        {"time":"2015-01-20","start":5.23,"max":5.35,"min":5.22,"end":5.33,"volumn":817.97,"money":4326.47},
        {"time":"2015-01-19","start":5.6,"max":5.67,"min":5.12,"end":5.16,"volumn":1248.82,"money":6669.96},
        {"time":"2015-01-16","start":5.67,"max":5.73,"min":5.66,"end":5.69,"volumn":399.54,"money":2274.94},
        {"time":"2015-01-15","start":5.6,"max":5.67,"min":5.57,"end":5.67,"volumn":361.28,"money":2031.66},
        {"time":"2015-01-14","start":5.62,"max":5.69,"min":5.61,"end":5.62,"volumn":321.27,"money":1812.93},
        {"time":"2015-01-13","start":5.64,"max":5.71,"min":5.58,"end":5.65,"volumn":375.35,"money":2120.87},
        {"time":"2015-01-12","start":5.79,"max":5.79,"min":5.58,"end":5.6,"volumn":516.19,"money":2921.05},
        {"time":"2015-01-09","start":5.95,"max":5.97,"min":5.8,"end":5.82,"volumn":701.39,"money":4123.5},
        {"time":"2015-01-08","start":5.95,"max":6.06,"min":5.91,"end":5.97,"volumn":676.75,"money":4056.12},
        {"time":"2015-01-07","start":6,"max":6.04,"min":5.92,"end":5.96,"volumn":546.93,"money":3267.16},
        {"time":"2015-01-06","start":5.89,"max":6.09,"min" : 5.84,"end":6.07,"volumn":1169.3,"money":6980.48},
        {"time":"2015-01-05","start":5.89,"max":6,"min":5.75,"end":5.94,"volumn":806.1,"money":4751.15}],
      forceFit: true,
      width: 500,
      height: 500,
      plotCfg: {
        margin: [60, 120, 30],
        background: {
          fill: '#191821'
        }
      }
    };
  }

  componentDidMount() {
    const self = this;

      // 创建数据源
      const Frame = G2.Frame;
      console.log(Frame);
      const frame = new Frame(this.state.data);
      console.log(frame);
      frame.addCol('trend', function(obj) {
        return (obj.start <= obj.end) ? 0 : 1;
      });
      self.setState({
        data: frame
      });
  }
  render() {
    let data = this.state.data;
    if (data instanceof G2.Frame) {
      data = data.toJSON();
    }


    console.log(data.length);

    if (data.length === 0) {

      return (<div> </div>);
    } else {
      return (
        <div>
          <Chart
            data={this.state.data}
            width={this.state.width}
            height={this.state.height}
            plotCfg={this.state.plotCfg}
            forceFit={this.state.forceFit} />
        </div>
      );
    }
  }
};
